import { animated, useSpring, useSprings, useSpringValue, useTrail } from "@react-spring/web";
import { useEffect } from "react";
import './index.css'

export default function SpringTest4() {
  const [springs, api] = useTrail(3, () => ({
    from: { width: 0 },
    config: {
      duration: 1000
    }
  }))

  useEffect(() => {
    api.start({ width: 300 });
  }, [])



  return <div>
    {springs.map(styles => (
      <animated.div className="box" style={{ ...styles }} ></animated.div>
    ))}
  </div>
}